@import "variable";
@import "mixin";

.navbar {
  &-nav {
    margin: 0;
  }

  &-item {
    float: left;
    .transition-transform();
    margin: 0;

    &:hover,
    &:focus {
      .translate(0, .2em);
    }

    &,
    a {
      font-size: 1.1em;
      text-shadow: none;

      &:hover,
      &:focus {
        text-shadow: 0 0 2px @gray-light;
      }
    }

    li& a {
      padding-top: 15px;
      padding-bottom: 15px;
    }
  }

  &-brand {
    font-size: 1.6em;
    font-weight: bold;
  }
}